<script lang="ts" setup>
	import { ref, reactive, inject, toRefs } from "vue";
	import { onLoad } from '@dcloudio/uni-app';
	import {
		getCurrentInstance
	} from 'vue'
	import {
		userStore
	} from '@/pinia';
	import {
		useRouter
	} from 'uni-mini-router';
	const {
		proxy,
	} = getCurrentInstance()
	const userStoreInfo = userStore();
	let router = useRouter()
	/*
		数据，暂时用tabs替代，后面直接用订单item的类型
		ype对应订单下一级tabs 01234
	*/
	let props = defineProps(['list'])
	console.log(props);
	//emits
	const emits = defineEmits(['closeOrder', 'goSendHuo', 'viewLogistics', 'confirmSignFor', 'jihui', 'tuihuo'])
	const closeOrder = (id) => {
		emits('closeOrder', {
			id,
		})
	}
	const goSendHuo = (id) => {
		emits('goSendHuo', {
			id,
		})
	}
	const viewLogistics = (item) => {
		emits('viewLogistics', {
			item
		})
	}
	const confirmSignFor = (id) => {
		emits('confirmSignFor', {
			id,
		})
	}
	const jihui = (id) => {
		emits('jihui', {
			id,
		})
	}
	const tuihuo = (id) => {
		emits('tuihuo', {
			id,
		})
	}
	//详情
	const routerLink = (status, id) => {
		if (status == 6) {
			//寄回详情
			router.push({
				name: 'jihuanOrderDetail',
				params: {
					id,
				}
			})
		} else if (status == -1) {
			//退款详情
			router.push({
				name: 'tuikuanOrderDetail',
				params: {
					id,
				}
			})
		} else {
			//普通详情
			router.push({
				name: 'gysNormalOrderDetail',
				params: {
					id,
				}
			})
		}
	}
</script>
<template>
	<view class="gysCard" v-for="(item,index) in props.list" :key="index" @click="routerLink(item.status,item.id)">
		<view class="gcTit r-flex-between-center">
			<text>{{ item.realName }}</text>
			<view class="r-flex-center-center">
				<text style="color: #909399;">{{ item.addTime }}拍下&nbsp;| </text>
				&nbsp;
				<text v-if="item.status==1">等待买家付款</text>
				<text v-if="item.status==2">买家已付款</text>
				<text v-if="item.status==3">卖家已发货</text>
				<text v-if="item.status==4">买家已收货</text>
				<text v-if="item.status==5">已评价</text>
				<text v-if="item.status==6">已完成</text>
				<text v-if="item.status==-2">订单已关闭</text>

				<text v-if="item.status==-1&&item.refundStatus==1">申请中</text>
				<text v-if="item.status==-1&&item.refundStatus==2">已同意</text>
				<text v-if="item.status==-1&&item.refundStatus==3">已寄回</text>
				<text v-if="item.status==-1&&item.refundStatus==4">已退款</text>
				<text v-if="item.status==-1&&item.refundStatus==5">退款失败</text>
				<text v-if="item.status==-1&&item.refundStatus==-1">取消售后</text>

				<text v-if="item.status==4&&item.sendbackStatus==1">申请寄还</text>
				<text v-if="item.status==4&&item.sendbackStatus==2">同意寄还</text>
				<text v-if="item.status==4&&item.sendbackStatus==3">已寄回</text>

			</view>
		</view>
		<view class="gcGoods r-flex-start-start" v-for="(it,key) in item.orderInfoList" :key="key">
			<image :src="it.sku!=null?it.sku.logo:''" mode=""></image>
			<view class="gcgCon c-flex-start-start">
				<text class="u-line-1">{{ it.productName }}</text>
				<text>￥{{ it.price }}</text>
				<text>×{{ it.cartNum }}</text>
			</view>
		</view>
		<view class="gcInAll">
			共{{ item.totalNum }}件 实收：¥{{ item.payPrice }}（含快递：¥{{ item.payPostage }}）
		</view>
		<view class="huiBox c-flex-start-start">
			<text class="orderNum">
				订单编号：{{ item.tradeNo }}
			</text>
			<text class="address">
				{{ item.realName }}，{{ item.userPhone }}，{{ item.userAddress }}
			</text>
		</view>
		<view class="btnContainer">
			<text class="btn" v-if="item.status==1" @click.stop="closeOrder(item.id)">
				<!-- 待付款 -->
				关闭订单
			</text>
			<text class="btn" v-if="item.status==2" @click.stop="goSendHuo(item.id)">
				<!-- 待发货 -->
				去发货
			</text>
			<text class="btn" v-if="item.status==3" @click.stop="viewLogistics(item)">
				<!-- 已发货 -->
				查看物流
			</text>
			<text class="btn" v-if="item.status==3" @click.stop="confirmSignFor(item.id)">
				<!-- 已发货 -->
				确认买家签收
			</text>
			<text class="btn" v-if="item.status==4&&item.sendbackStatus!=0" @click.stop="jihui(item.id)">
				<!-- 寄回 -->
				处理寄回
			</text>
			<text class="btn" v-if="item.status==-1" @click.stop="tuihuo(item.id)">
				<!-- 售后 -->
				处理退货
			</text>
		</view>
	</view>
	<view class="" style="margin-top: 150rpx;" v-if="props.list.length<1">
		<u-empty mode="order">
		</u-empty>
	</view>
</template>
<style lang="scss">
	view {
		box-sizing: border-box;
	}

	.gysCard {
		width: 686rpx;
		margin: 16rpx auto;
		padding: 32rpx;
		background: #FFFFFF;
		box-shadow: 8rpx 8rpx 32rpx 0rpx rgba(0, 0, 0, 0.04);
		border-radius: 24rpx;
		border: 2rpx solid #FFFFFF;

		.gcTit {
			font-size: 24rpx;
			margin-bottom: 32rpx;
		}

		.gcGoods {
			margin-bottom: 32rpx;

			image {
				width: 140rpx;
				height: 140rpx;
				margin-right: 16rpx;
			}

			.gcgCon {
				width: 450rpx;

				text:nth-child(1) {
					font-weight: 600;
				}

				text:nth-child(2) {
					font-size: 28rpx;
					margin: 16rpx 0;
				}

				text:nth-child(3) {
					font-size: 28rpx;
				}
			}
		}

		.gcInAll {
			color: #909399;
			font-size: 24rpx;
			text-align: right;
			margin-bottom: 16rpx;
		}

		.huiBox {
			padding: 16rpx;
			background-color: #F5F6F8;
			border-radius: 10rpx;

			.orderNum {
				font-size: 24rpx;
				color: #909399;
				margin-bottom: 16rpx;
			}

			.address {
				font-size: 24rpx;
			}
		}

		.btnContainer {
			text-align: right;
			margin-top: 32rpx;

			.btn {
				padding: 10rpx 32rpx;
				background-color: #CB645E;
				color: #fff;
				font-size: 24rpx;
				border-radius: 10rpx;
				margin-left: 16rpx;
			}
		}
	}
</style>